import React from 'react';
import Taro from '@tarojs/taro';
import {connect} from 'react-redux';
import {View} from '@tarojs/components';
import {AtButton, AtIcon} from "taro-ui";
import { Loading, Overlay } from '@nutui/nutui-react-taro'
import getBaseUrl from "../../../service/baseUrl";
import './index.scss'
import {Switch} from "@nutui/nutui-react-taro";

const base = getBaseUrl();

function Setting(props) {
    const {dispatch, refund, loading} = props;
    const WrapperStyle = {
        display: 'flex',
        height: '100%',
        alignItems: 'center',
        justifyContent: 'center',
    }
    return (
        <View className='settingWrap'>
            <View className='chargeInfoCard'>
                <View className='balanceLabel'>充电完成自动退款</View>
                <Switch
                    // defaultChecked
                    checked={!!refund}
                    activeText="开"
                    inactiveText="关"
                    style={{
                        '--nutui-switch-open-background-color': '#0091ff',
                        '--nutui-switch-close-line-background-color': '#ebebeb',
                    }}
                    onChange={(e) => {
                        dispatch({
                            type: 'wallet/setAutoRefunds',
                            payload: {
                                status: e ? 1 : 0
                            }
                        })
                    }}
                />
            </View>
            <View className='chargeInfoCard' onClick={() => Taro.navigateTo({url: '/moduleB/pages/setting/deal'})}>
                <View>用户协议</View>
                <View><AtIcon value='chevron-right' size='18' color='#767E8E'/></View>
            </View>
            <View className='chargeInfoCard' onClick={() => Taro.navigateTo({url: '/moduleB/pages/setting/rule'})}>
                <View>个人信息处理规则</View>
                <View><AtIcon value='chevron-right' size='18' color='#767E8E'/></View>
            </View>
            <View className='chargeInfoCard' onClick={() => Taro.navigateTo({url: '/moduleB/pages/aboutUs/index'})}>
                <View>关于我们</View>
                <View><AtIcon value='chevron-right' size='18' color='#767E8E'/></View>
            </View>
            <View className='logoOut'>
                <AtButton
                    disabled={!Taro.getStorageSync('isLogin')}
                    onClick={() => {
                        Taro.showModal({
                            title: '提示',
                            content: '确定退出吗',
                            success: function (res) {
                                if (res.confirm) {
                                    Taro.request({
                                        url: `${base}/logout`,
                                        method: "POST",
                                    }).then((res) => {
                                        console.log('退出登录', res);
                                        if (res.statusCode === 200) {
                                            Taro.setStorageSync('isLogin', false);
                                            Taro.removeStorage({key: 'phoneNumber'});
                                            Taro.removeStorage({key: 'access_token'});
                                            Taro.removeStorage({key: 'session_key'});
                                            Taro.removeStorage({key: 'openid'});
                                            Taro.showToast({
                                                title: '退出登录成功',
                                                icon: 'none',
                                                duration: 2000,
                                                success: function () {
                                                    setTimeout(function () {
                                                        //跳转到首页，强制重启
                                                        Taro.reLaunch({url: '/pages/mine/index'});
                                                    }, 2000);
                                                }
                                            });
                                        } else {
                                            Taro.showToast({
                                                title: res?.data?.msg || '退出失败',
                                                icon: 'none',
                                                duration: 2000,
                                            });
                                        }
                                    })
                                } else if (res.cancel) {
                                    console.log('用户点击取消')
                                }
                            }
                        })
                    }}
                >退出登录</AtButton>
            </View>
            {
                loading ?
                    <Overlay visible={loading}>
                        <div className="wrapper" style={WrapperStyle}>
                            <Loading direction="vertical">加载中...</Loading>
                        </div>
                    </Overlay> : null
            }
        </View>
    )
}

export default connect(({
                            wallet = {},
                            loading: {effects: {"wallet/setAutoRefunds": loading = false} = {}} = {},
                        }) => {
    return {
        ...wallet,
        loading
    }
})(Setting)
